Skip to content

docs: update styles docs #5855

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 13 commits into
base: main
Choose a base branch
from
Open

docs: update styles docs #5855

wants to merge 13 commits into from
+256 −115

Conversation

@rise-erpelding
Copy link
Collaborator

@rise-erpelding rise-erpelding commented Nov 6, 2025 •
edited by marissahuysentruyt
Loading

Description

Updates the @spectrum-web-components/styles package documentation for clarity and completeness.

Updated 11/11: Expands documentation to more thoroughly describe tokens, with code snippets, while minimizing documentation about themes files, which will be deprecated.

Motivation and context

Part of a larger docs improvement initiative to update documentation.

Related issue(s)

  • closes SWC-432

Author's checklist

  • I have read the CONTRIBUTING and PULL_REQUESTS documents.
  • I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
  • I have added automated tests to cover my changes.
  • I have included a well-written changeset if my change needs to be published.
  • I have included updated documentation if my change required it.

Reviewer's checklist

  • Includes a Github Issue with appropriate flag or Jira ticket number without a link
  • Includes thoughtfully written changeset if changes suggested include patch, minor, or major features
  • Automated tests cover all use cases and follow best practices for writing
  • Validated on all supported browsers
  • All VRTs are approved before the author can update Golden Hash

Manual review test cases

1. Link validation

  • All internal links work as expected
  • All external links work as expected

2. Code examples and imports

  • All import paths reference files that actually exist in the package
  • Code examples are accurate and functional
  • Language tags are correct (CSS imports use css not ts)

3. Terminology consistency

  • Terms like "system variants", "color options", and "scales" are used consistently throughout

4. Markdown formatting and readability

  • No duplicate headings
  • Proper heading hierarchy
  • Tables render correctly
  • Sentence case is used consistently

Device review

  • Did it pass in Desktop?
  • Did it pass in (emulated) Mobile?
  • Did it pass in (emulated) iPad?

@rise-erpelding rise-erpelding requested a review from a team as a code owner November 6, 2025 01:48
@changeset-bot
Copy link

changeset-bot bot commented Nov 6, 2025 •
edited
Loading

⚠️ No Changeset found

Latest commit: caaaca3

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@github-actions
Copy link
Contributor

github-actions bot commented Nov 6, 2025 •
edited
Loading

📚 Branch Preview

🔍 Visual Regression Test Results

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

Deployed to Azure Blob Storage: pr-5855

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

@rise-erpelding rise-erpelding added Status: Ready for review PR ready for review or re-review. Documentation Issues or PRs involving changes to documentation or documentation website labels Nov 6, 2025
@rise-erpelding rise-erpelding force-pushed the rise-erpelding/swc-432-styles-docs branch from 75ff964 to 4f6c32e Compare November 6, 2025 02:12
@rise-erpelding rise-erpelding self-assigned this Nov 6, 2025
Rajdeepc
Rajdeepc requested changes Nov 6, 2025
View reviewed changes
Copy link
Contributor

@Rajdeepc Rajdeepc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good start! If you can take a look at the heading hierarchy that would help!
What's included section is optional for me! But you can take others suggestions on this whether to keep it or not!

@rise-erpelding rise-erpelding force-pushed the rise-erpelding/swc-432-styles-docs branch from 4f6c32e to 305737d Compare November 7, 2025 20:12
@rise-erpelding
Copy link
Collaborator Author

rise-erpelding commented Nov 7, 2025

@Rajdeepc I think I've addressed most of your feedback here, thanks!

I removed a lot of the references to "Legacy" since it doesn't seem like that's terminology we're using.

I made a lot of adjustments to heading levels, although I ended up getting down to h5 and those look a little strange to me, happy to change those if we decide we'd rather not use that heading level.

I addressed the syntax highlighting suggestions too! I realized that a lot of these are @import syntax which is css, so it's neither Typescript nor JavaScript.

Last thing: you left a comment about code snippets, I haven't addressed this yet but wanted to push up what I had today.

@rise-erpelding rise-erpelding force-pushed the rise-erpelding/swc-432-styles-docs branch from 305737d to e7a1d35 Compare November 11, 2025 21:51
@rise-erpelding rise-erpelding force-pushed the rise-erpelding/swc-432-styles-docs branch from e7a1d35 to 5d2b4e8 Compare November 11, 2025 22:02
@rise-erpelding rise-erpelding force-pushed the rise-erpelding/swc-432-styles-docs branch from b50d061 to 4d0d3c2 Compare November 11, 2025 22:15
rise-erpelding
rise-erpelding commented Nov 11, 2025
View reviewed changes
marissahuysentruyt
marissahuysentruyt requested changes Nov 12, 2025
View reviewed changes
Copy link
Collaborator

@marissahuysentruyt marissahuysentruyt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I only found one link that didn't work, and otherwise this looks great! I left a few extra questions for you, but I don't think any of them are blockers.

Nice work!

@rise-erpelding
docs: pr fixes
49a8725 
- Indentation fixes
- Core tokens link fix
- Use "Spectrum 2 tokens" rather than "v2-tokens" or "tokens-v2"
- Adjust imports and comments in example
@rise-erpelding
docs: use tabs instead of h5s
9922293
@rise-erpelding
docs: update typography guidance
fc1ce13
@rise-erpelding
chore: correct package exports order for token wildcards
6a63a69
github-actions[bot]
github-actions bot reviewed Nov 12, 2025
View reviewed changes
rise-erpelding
rise-erpelding commented Nov 12, 2025
View reviewed changes
marissahuysentruyt
marissahuysentruyt approved these changes Nov 12, 2025
View reviewed changes
Copy link
Collaborator

@marissahuysentruyt marissahuysentruyt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for making those changes so quickly- looks great.
finger guns

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@github-actions github-actions[bot] github-actions[bot] left review comments

@marissahuysentruyt marissahuysentruyt marissahuysentruyt approved these changes

@Rajdeepc Rajdeepc Awaiting requested review from Rajdeepc

@caseyisonit caseyisonit Awaiting requested review from caseyisonit

Requested changes must be addressed to merge this pull request.

Assignees

@rise-erpelding rise-erpelding

Labels

Documentation Issues or PRs involving changes to documentation or documentation website Status: Ready for review PR ready for review or re-review.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@rise-erpelding @Rajdeepc @caseyisonit @marissahuysentruyt